iOS 11 之后 iPad 分屏适配探究 您所在的位置:网站首页 ios 142分屏 iOS 11 之后 iPad 分屏适配探究

iOS 11 之后 iPad 分屏适配探究

2024-07-09 11:40| 来源: 网络整理| 查看: 265

[toc]

体验分屏

分屏方式就是:打开第一个程序,上滑展示程序坞,按住第二个程序拖入屏幕(此时是悬浮模式),悬浮模式顶部‘-’长按拖动可以实现分屏模式(也可以用于切换) 分屏模式与悬浮模式可以共存,也就是可以同时开 3 个程序,在一个屏幕上

mac 分屏,长按左上角绿色那个就行(按一下是全屏)

开发问题 需要使用 launch Screen File 才行,使用 Launch Images Sourc 是不行的(坑了好久,网上也搜不到什么答案) 如果要用到这个分屏,自动布局就要求很牛逼了(关于自动布局,又可以进一步提升) iOS 11 之前的分屏(悬浮分屏),宽度基本是定死的(320 或 375) iOS 11 之后,有 2种分屏,一种就是悬浮分屏;另一种是真分屏,同时使用 APP,会存在 3 中分配方式(小+大、大+小、平分)(注:并不是平分屏幕,因为中间有个分割线,实测为 10pt)

竖屏时,只有左右分屏,小的部分为 320 或者 375(就是塞了个 5s 或者 8 的屏幕宽度) 横屏时,存在平分,除去分割线之后平分 xcode 9.3 已经在 sb 中体现了,分屏预览,直接用 sb 开发也是很有好处啊,为啥都不喜欢呢,不觉得冲突很多啊

分屏得注意(不要以 pad 的尺寸,写死了一些约束值)(以前都是以屏幕尺寸来判断屏幕尺寸的,在分屏的情况下可能不适用了,得想办法根据当前视图大小来适配了) 如果开发 iPhone,不支持 iPad 的话,APP 在 iPad 上依旧可以打开,但是不能使用分屏的,那么就不用仔细适配(至少保证能用,不然审核还是不过) 初探 分辨率表 iPhone 设备 开发尺寸 倍数 sizeClass 竖屏 iPhone4/4s 320x480 @2x CR iPhone5/5s/se 320x568 @2x CR iPhone6/7/8 375x667 @2x CR iPhone6+/7+/8+ 414x736 @3x CR iPhoneX 375x812 @3x CR 横屏 iPhone4/4s 480x320 @2x CC iPhone5/5s/se 568x320 @2x CC iPhone6/7/8 667x375 @2x CC iPhone6+/7+/8+ 736x414 @3x RC iPhoneX 812x375 @3x CC iPad 设备 开发尺寸 倍数 sizeClass 竖屏 iPad 7.9/9.7 768x1024 @2x RR iPad 10.5 834x1112 @2x RR iPad 12.9 1024x1366 @2x RR 横屏 iPad 7.9/9.7 768x1024 @2x RR iPad 10.5 834x1112 @2x RR iPad 12.9 1024x1366 @2x RR iPad 分屏 设备 开发尺寸 倍数 sizeClass iPad 7.9/9.7 横屏 大 694x768 @2x RR iPad 7.9/9.7 横屏 中 507x768 @2x CR iPad 7.9/9.7 横屏 小 320x768 @2x CR iPad 7.9/9.7 竖屏 大 438x1024 @2x CR iPad 7.9/9.7 竖屏 小 320x1024 @2x CR iPad 10.5 横屏 大 782x834 @2x RR iPad 10.5 横屏 中 551x834 @2x CR iPad 10.5 横屏 小 320x834 @2x CR iPad 10.5 竖屏 大 504x1112 @2x CR iPad 10.5 竖屏 小 320x1112 @2x CR iPad 12.9 横屏 大 981x1024 @2x RR iPad 12.9 横屏 中 678x1024 @2x RR iPad 12.9 横屏 小 375x1024 @2x CR iPad 12.9 竖屏 大 639x1366 @2x CR iPad 12.9 竖屏 小 375x1366 @2x CR 100% 使用自动布局 ? 想要针对性布局肯定不靠谱啊 参考 h5 使用流动布局

宽:完全按比例,包括间隔,使用容器百分制宽度 高:从上往下堆叠,下面留白,适当使用 footer

字体 不方便,只能特殊设置,很难受,考虑别的办法 使用 sizeClass iOS 8 就开始有了,现在用很舒服,以前基本没用过啊 width:compact,regular,any height:compact,regular,any 苹果的分类 按分类补充了上面的分辨率表 简单理解: 类似手机:CR 类似平板:RR 手机横屏:CC 特殊 plus 横屏:RC 代码实现 纯代码:使用 UITraitCollection 类即可,已经更新在 UIKit API 部分 sb:很方便,大部分属性边上就可以 +,跟按钮一样设置状态即可 相关思考 根据苹果的分类,compact,regular,any 组合后就是 4 种 那么不论是 UI 适配,还是 字体 适配等, 都使用统一的分类适配方案即可 如果 iPhone 仅竖屏,iPad 4 周旋转,只需要 2 套 适配方案 CR 和 RR 总结 iOS 11 之后,iPad 有完全分屏之后,sizeClass 就十分有用,仅 iPad 上就需要 2 中布局,仅使用设备判断的方式,肯定不满足适配要求 使用 iPhone 竖屏,iPad 4 周旋转,适配 CR 和 RR 2 套方案即可适配 iPhone 和 iPad,而且支持 分屏 针对 iPhone 内部 5、6、6p、X 的特殊适配另讲 后续问题 iPad 横版的话,宽度特别大,跟竖屏的用一个排版得难看,一般会变成左右排版 仅根据 sizeClass 又不好判断,再根据设备旋转方向适配,又是一条不归路 如果 iPad 版统一搞成横版好像效果也还不错,具体情况再说 或者与浏览器一样 2 边留白


【本文地址】

公司简介

联系我们

今日新闻

    推荐新闻

    专题文章
      CopyRight 2018-2019 实验室设备网 版权所有